<template>
	<view class="u-rela">
		<div class="u-font-48 blod u-p-b-20">企业证件认证</div>
		<div class="u-font-26 u-content-color u-m-b-20">请确保您输入的信息真实有效</div>
		<u-form :model="form" ref="uForm" label-position="top">
			<u-form-item label="公司创办人">
				<u-input v-model="form.name" placeholder="请输入姓名" />
			</u-form-item>
			<u-form-item label="创办人身份证号">
				<u-input v-model="form.identity_number" placeholder="请输入身份证号码" />
			</u-form-item>
			<u-form-item label="上传身份证照片">
				<div class="u-flex u-row-between">
					<u-upload class="id-upload" ref="uUpload_front" :custom-btn="true" max-count="1"
						:file-list="fileList" :auto-upload="false" @on-choose-complete="on_choose_complete_front">
						<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
							<image class="id"
								src="https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/recruit/id-1.png"
								mode=""></image>
							<text>上传人像面</text>
						</view>
					</u-upload>
					<u-upload class="id-upload" ref="uUpload_opposite" :custom-btn="true" max-count="1"
						:file-list="fileList2" :auto-upload="false" @on-choose-complete="on_choose_complete_opposite">
						<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
							<image class="id"
								src="https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/recruit/id-2.png"
								mode=""></image>
							<text>上传国徽面</text>
						</view>
					</u-upload>
				</div>
			</u-form-item>
			<u-form-item label="上传营业执照">
				<u-upload class="yyzz-upload" ref="uUpload_license" upload-text="上传营业执照" max-count="1" :file-list="fileList3"
					:auto-upload="false" @on-choose-complete="on_choose_complete_license"></u-upload>
			</u-form-item>
		</u-form>
		<button class="u-reset-button btn u-m-t-60" @click="submit">提交</button>
		<!-- <navigator url="/pages/recruit/company?type=worker">
			
		</navigator> -->
		
		<u-popup v-model="show" mode="center" border-radius="30">
			<view class="popContent">
				<view class="pop_title">
					您还没有公司认证哦!
				</view>
				<view class="pop_btn">
					<span @click="tocorCertify">去认证</span>
					<span @click="toRecruit_company">取消</span>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				show:false,
				fileList: [],
				fileList2: [],
				fileList3: [],
				form: {
					name: '',
					identity_number: '',
					front_url: '', //正面
					opposite_url: '', //反面
					license_url:'',//营业执照
				},
				certification_id:''
			}
		},
		onLoad() {
			// 认证详情
			this.get_recruit_certificationDetails()
		},
		methods: {
			//
			tocorCertify(){
				uni.navigateTo({
					url:`/pages/recruit/worker/corCertify`
				})
			},
			
			// 点击取消回到首页
			toRecruit_company(){
				uni.navigateTo({
					url:'/pages/recruit/company'
				})
			},
			
			// 提交
			submit() {
				if(this.certification_id == 0){
					// 添加认证信息
					this.get_recruit_addCertification()
				}else{
					// 修改认证信息
					this.get_recruit_editCertification()
				}
			},

			// 点击actionSheet回调
			addressCallback(index) {
				this.form.address = this.addressList[index].text;
			},
			// 点击actionSheet回调
			scaleCallback(index) {
				this.form.scale = this.scaleList[index].text;
			},
			// 点击actionSheet回调
			industryCallback(index) {
				this.form.industry = this.industryList[index].text;
			},
			// 点击actionSheet回调
			experienceCallback(index) {
				this.form.experience = this.experienceList[index].text;
			},

			// 上传正面
			on_choose_complete_front() {
				let that = this
				let tempFilePaths = this.$refs.uUpload_front.lists[0].url
				uni.uploadFile({
					url: that.api.baseUrl + that.api.upload_file, //真实的接口地址
					filePath: tempFilePaths,
					name: 'file',
					formData: {
						'user': 'test'
					},
					success: (uploadFileRes) => {
						that.front_url = JSON.parse(uploadFileRes.data).data.url
					}
				});
			},
			// 上传反面
			on_choose_complete_opposite() {
				let that = this
				let tempFilePaths = this.$refs.uUpload_opposite.lists[0].url
				uni.uploadFile({
					url: that.api.baseUrl + that.api.upload_file, //真实的接口地址
					filePath: tempFilePaths,
					name: 'file',
					formData: {
						'user': 'test'
					},
					success: (uploadFileRes) => {
						that.opposite_url = JSON.parse(uploadFileRes.data).data.url
					}
				});
			},
			
			// 上传营业执照
			on_choose_complete_license() {
				let that = this
				let tempFilePaths = this.$refs.uUpload_license.lists[0].url
				uni.uploadFile({
					url: that.api.baseUrl + that.api.upload_file, //真实的接口地址
					filePath: tempFilePaths,
					name: 'file',
					formData: {
						'user': 'test'
					},
					success: (uploadFileRes) => {
						that.license_url = JSON.parse(uploadFileRes.data).data.url
					}
				});
			},

			// 添加认证信息
			get_recruit_addCertification() {
				this.$http({
					url: this.api.recruit_addCertification,
					method: 'POST',
					data: {
						name: this.form.name, //创办人姓名姓名
						identity_number: this.form.identity_number, //身份证号码
						identity_front: this.front_url, //身份证正面照
						identity_back: this.opposite_url, //身份证背面照
						business_license: this.license_url, //营业执照
					}
				}).then(res => {
					if(res.code == 1){
						uni.navigateTo({
							url:'/pages/recruit/company?type=worker'
						})
					}
				})
			},
			
			// 修改认证信息
			get_recruit_editCertification(){
				this.$http({
					url:this.api.recruit_editCertification,
					method:'POST',
					data:{
						name: this.form.name, //创办人姓名姓名
						identity_number: this.form.identity_number, //身份证号码
						identity_front: this.front_url, //身份证正面照
						identity_back: this.opposite_url, //身份证背面照
						business_license: this.license_url, //营业执照
					}
				}).then(res => {
					if(res.code == 1){
						uni.navigateTo({
							url:'/pages/recruit/company?type=worker'
						})
					}
				})
			},

			// 认证详情
			get_recruit_certificationDetails(){
				this.$http({
					url:this.api.recruit_certificationDetails,
					method:'GET'
				}).then(res=>{
					if(res.code == 1){
						this.certification_id = res.data.certification_id
						// if(res.data.certification_id == 0){
						// 	this.show = true
						// 	return
						// }
						this.form.name = res.data.name;
						this.form.identity_number = res.data.identity_number;
						this.form.front_url = res.data.identity_front;
						this.form.opposite_url = res.data.identity_back;
						this.form.license_url = res.data.business_license
					}
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.id-upload {
		/deep/ .u-upload {
			width: 335rpx;
			height: 270rpx;
			background: #FFFFFF;
			border: 1px solid #E6E6E6;
			border-radius: 10rpx;

		}

		/deep/ .u-list-item {
			width: 315rpx !important;
			height: 250rpx !important;
			border: 0 !important;
		}
	}

	.yyzz-upload {
		/deep/ .u-upload {
			width: 440rpx;
			height: 300rpx;

		}

		/deep/ .u-list-item {
			width: 420rpx !important;
			height: 280rpx !important;
			border: 0 !important;
		}
	}

	.slot-btn {
		width: 335rpx;
		height: 270rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;

		.id {
			width: 252rpx;
			height: 174rpx;
		}

		text {
			font-size: 24rpx;
			color: #666;
			line-height: 1;
		}
	}

	.btn {
		width: 690rpx;
		height: 100rpx;
		background: #07C160;
		border-radius: 15rpx;
		font-size: 34rpx;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	/deep/ .u-border-bottom:after {
		border: 0;
	}

	/deep/ .u-form-item--left {
		margin-bottom: 0 !important;
	}

	/deep/ .u-input {
		border: 1px solid #E6E6E6;
		border-radius: 10rpx;
		padding: 0 30rpx !important;
		font-size: 28rpx;
		min-height: 88rpx;
	}

	/deep/ .u-input__input {
		min-height: 88rpx !important;
	}

	/deep/ .u-mode-light-info {
		padding: 12rpx 17rpx !important;
		border-radius: 8rpx !important;
		border: 0 !important;
		height: 66rpx !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center;
	}

	/deep/ .u-form-item {
		padding: 10rpx 0 !important;
	}

	.textarea /deep/ .u-input {
		height: 180rpx;
		background: #F3F3F3;
		border: 1px solid #E6E6E6;
		border-radius: 10rpx;
		padding: 20rpx 30rpx !important;
	}

	.icon-plus-wrap {
		width: 100rpx;
		height: 66rpx;
		background: #F3F3F3;
		border-radius: 8rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.popContent{
		width: 400rpx;
		height: 200rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		
		.pop_title{
			font-size: 34rpx;
			font-family: PingFang-SC-Bold;
			font-weight: bold;
			color: #333333;
		}
		
		.pop_btn{
			width: 100%;
			box-sizing: border-box;
			padding: 0 30rpx;
			display: flex;
			justify-content: space-between;
			margin-top: 30rpx;
			
			>span:nth-child(1){
				width: 160rpx;
				height: 60rpx;
				background: #07C160;
				border-radius: 15rpx;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #FFFFFF;
				text-align: center;
				line-height: 60rpx;
			}
			
			>span:nth-child(2){
				width: 160rpx;
				height: 60rpx;
				background: #F3F3F3;
				border-radius: 15rpx;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #999999;
				text-align: center;
				line-height: 60rpx;
			}
		}
	}
</style>
<style>
	page {
		padding: 30rpx;
		background: #fff;
	}
</style>